<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>My JSP 'managerList.jsp' starting page</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<link href="css/mytablecss.css" rel="stylesheet" type="text/css" />
</head>

<body>
	<h3 style="padding:15px;">管理员列表</h3>
	<a class="mybtn f-r mgr" id="create_btn">创建管理员</a>
	<br>
	<div class="pd-20">
		<div class="mt-20">
			<table id="tb_manager"
				class="table table-border table-bordered table-hover table-bg table-sort">
				<thead>
					<tr class="text-c">
						<!-- <th width="80">序号</th> -->
						<th width="200">姓名</th>
						<th width="200">账号</th>
						<!-- <th width="200">密码</th> -->
						<th width="200">身份证</th>
						<th width="200">联系电话</th>
						<th width="200">创建时间</th>
						<th width="150">权限等级</th>
						<th width="200">最近登陆时间</th>
						<th width="100">最近登陆ip</th>
						<th width="100">操作</th>
					</tr>
				</thead>
				<tbody>
					<c:forEach items="${requestScope.managerList}" var="manager">
						<tr>
							<td value="${manager.id}"><c:out value="${manager.name}"></c:out></td>
							<td><c:out value="${manager.account}"></c:out></td>
							<%-- <td><c:out value="${manager.password}"></c:out></td> --%>
							<td><c:out value="${manager.identity}"></c:out></td>
							<td><c:out value="${manager.phone}"></c:out></td>
							<td><c:out value="${manager.create_time}"></c:out></td>
							<td><c:if test="${manager.rank== 1}">超级管理员</c:if> <c:if
									test="${manager.rank == 2}">考试管理员</c:if> <c:if
									test="${manager.rank == 3}">教师管理员</c:if>
							<td><c:out value="${manager.login_time}"></c:out></td>
							<td><c:out value="${manager.login_ip}"></c:out></td>
							<%-- <td style="display:none"><c:out value="${manager.id}"></c:out></td> --%>
							<td class="td-manage"><a title="编辑" class="ml-5 edit"
								style="text-decoration:none" onclick="edit(this)"> <i
									class="Hui-iconfont">&#xe6df;</i></a> <a
								style="text-decoration:none" class="ml-5"
								onClick="alterPassword(this)" title="修改密码"> <i
									class="Hui-iconfont">&#xe63f;</i></a> <!-- <a title="删除"
								href="javascript:;" onclick="remove(this)" class="ml-5"
								style="text-decoration:none"> <i class="Hui-iconfont">&#xe6e2;</i></a> --></td>
						</tr>
					</c:forEach>
				</tbody>
			</table>
		</div>
	</div>

	<div id="bcg_alter_password" class="editor_background">
		<form id="manager_alterpwd_form"
			class="editor_main form form-horizontal">
			<legend>管理员修改密码窗口 </legend>
			<div style="margin-left: 21%;">

				<br />
				<div class="row">
					<label class="form-label col-xs-4 col-sm-3">账号:</label>
					<div class="formControls col-xs-8 col-sm-9 input_manager">
						<input id="i_account2" name="i_account2" class="input-text"
							type="text" disabled>
					</div>
				</div>
				<br />
				<div class="row" style="margin-top: 25px;">
					<label class="form-label col-xs-4 col-sm-3">新的密码:</label>
					<div class="formControls col-xs-8 col-sm-9 input_manager">
						<input id="i_new_password2" name="i_new_password2"
							class="input-text" type="password">
					</div>
				</div>
				<br />
				<div class="row" style="margin-top: 25px;">
					<label class="form-label col-xs-4 col-sm-3">确认密码:</label>
					<div class="formControls col-xs-8 col-sm-9 input_manager">
						<input id="i_ensure_password2" name="i_ensure_password2"
							class="input-text" type="password">
					</div>
				</div>
				<br />
				<div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
					<input id="btn_ensure2" class="btn btn-primary f-l btn_ensure"
						style="width: 75px;" value="确认" readonly> <input
						id="btn_exit2" class="btn btn-primary f-l btn_exit" value="取消"
						readonly>
				</div>
				<input id="manager_id2" name="manager_id2" class="input-text"
					type="text" style="display:none;">
			</div>
		</form>
	</div>
	<div id="bcg_editor" class="editor_background">
		<form id="manager_edit_form" class="editor_main form form-horizontal">
			<legend>管理员信息窗口 </legend>
			<div style="margin-left: 21%;">
				<div class="row">
					<label class="form-label col-xs-4 col-sm-3">账号:</label>
					<div class="formControls col-xs-8 col-sm-9 input_manager">
						<input id="i_account" name="i_account" class="input-text"
							type="text" disabled>
					</div>
				</div>
				<br />
				<div class="row" style="margin-top: 25px;">
					<label class="form-label col-xs-4 col-sm-3">真实姓名:</label>
					<div class="formControls col-xs-8 col-sm-9 input_manager">
						<input id="i_name" name="i_name" class="input-text" type="text">
					</div>
				</div>
				<br />
				<div class="row" style="margin-top: 25px;">
					<label class="form-label col-xs-4 col-sm-3">身份证号:</label>
					<div class="formControls col-xs-8 col-sm-9 input_manager">
						<input id="i_identity" name="i_identity" class="input-text"
							type="text">
					</div>
				</div>
				<br />
				<div class="row" style="margin-top: 25px;">
					<label class="form-label col-xs-4 col-sm-3">联系电话 :</label>
					<div class="formControls col-xs-8 col-sm-9 input_manager">
						<input id="i_phone" name="i_phone" class="input-text" type="text">
					</div>
				</div>
				<br />
				<div class="row" style="margin-top: 25px;">
					<label class="form-label col-xs-4 col-sm-3">创建时间:</label>
					<div
						class="formControls skin-minimal col-xs-8 col-sm-9 input_manager">
						<input id="i_create_time" class="input-text" type="text" disabled>
					</div>
				</div>
				<br />
				<div class="row" style="margin-top: 25px;">
					<label class="form-label col-xs-4 col-sm-3">权限等级:</label>
					<div class="formControls col-xs-8 col-sm-9">
						<div class="rb_manager">
							<input type="radio" name="type" value=1> <label
								for="sex-1">超级管理员</label> <input type="radio" name="type"
								value=2> <label for="sex-0">考试管理员</label> <input
								type="radio" name="type" value=3> <label for="sex-0">普通管理员</label>
						</div>
					</div>
				</div>
				<br />
				<div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
					<input id="btn_ensure" class="btn btn-primary f-l btn_ensure"
						style="width: 75px;" value="确认" readonly> <input
						id="btn_exit" class="btn btn-primary f-l btn_exit" value="取消"
						readonly>
				</div>
				<input id="manager_id" name="manager_id" class="input-text"
					type="text" style="display:none;">
			</div>
		</form>
	</div>
	<div id="create_manager" class="create_manager">
		<form id="manager_create_form"
			class="create_main form form-horizontal">
			<legend>创建管理员窗口 </legend>
			<div style="margin-left: 21%;">
				<div class="row">
					<label class="form-label col-xs-4 col-sm-3">账号:</label>
					<div class="formControls col-xs-8 col-sm-9 input_manager">
						<input id="i_account1" class="input-text" type="text"
							name="i_account1">
					</div>
				</div>
				<br />
				<div class="row" style="margin-top: 25px;">
					<label class="form-label col-xs-4 col-sm-3">密码:</label>
					<div class="formControls col-xs-8 col-sm-9 input_manager">
						<input id="i_password1" name="i_password1" class="input-text"
							type="password">
					</div>
				</div>
				<br />
				<div class="row" style="margin-top: 25px;">
					<label class="form-label col-xs-4 col-sm-3">真实姓名:</label>
					<div class="formControls col-xs-8 col-sm-9 input_manager">
						<input id="i_name1" name="i_name1" class="input-text" type="text">
					</div>
				</div>
				<br />
				<div class="row" style="margin-top: 25px;">
					<label class="form-label col-xs-4 col-sm-3">身份证号:</label>
					<div class="formControls col-xs-8 col-sm-9 input_manager">
						<input id="i_identity1" name="i_identity1" class="input-text"
							type="text">
					</div>
				</div>
				<br />
				<div class="row" style="margin-top: 25px;">
					<label class="form-label col-xs-4 col-sm-3">联系电话 :</label>
					<div class="formControls col-xs-8 col-sm-9 input_manager">
						<input id="i_phone1" name="i_phone1" class="input-text"
							type="text">
					</div>
				</div>
				<br />
				<div class="row" style="margin-top: 25px;">
					<label class="form-label col-xs-4 col-sm-3">权限等级:</label>
					<div class="formControls col-xs-8 col-sm-9">
						<div class="rb_manager">
							<input id="i_rank1" type="radio" name="i_rank1" value=1>
							<label for="sex-1">超级管理员</label> <input type="radio"
								name="i_rank1" value=2> <label for="sex-0">考试管理员</label>
							<input type="radio" name="i_rank1" value=3> <label
								for="sex-0">教师管理员</label> <input style="display:none;"
								id="hiden_radio" type="radio" name="i_rank1" value=4> <label
								for="sex-0"></label>
						</div>
					</div>
				</div>
				<br />
				<div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
					<input id="btn_ensure1" class="btn btn-primary f-l btn_ensure"
						style="width: 75px;" value="确认" readonly> <input
						id="btn_exit1" class="btn btn-primary f-l btn_exit" value="取消"
						readonly>
				</div>
			</div>
		</form>
	</div>
</body>
<script type="text/javascript">
	$(function() {
		$('.table-sort').dataTable({
			"aaSorting" : [ [ 0, "asc" ] ],//默认第几个排序
			"bStateSave" : true,//状态保存 
			"bRetrieve" : true,
			"aoColumnDefs" : [
			//{"bVisible": false, "aTargets": [ 3 ]} //控制列的隐藏显示
			//{"orderable":false,"aTargets":[7]}// 制定列不参与排序
			]
		});
	});

	//编辑窗口取消按钮
	$(function() {
		$('#btn_exit').on('click', function() {
			$('#bcg_editor').hide();
		});
		$('#btn_exit1').on('click', function() {
			setEmpty();
			$('#create_manager').hide();
		});
		$('#btn_exit2').on('click', function() {
			setEmpty();
			$('#bcg_alter_password').hide();
		});

	});
	//编辑窗口确认按钮
	$(function() {
		//修改管理员信息窗口
		$('#btn_ensure').on('click', function() {
			//判断输入合法性
			if (!$("#manager_edit_form").valid()) {
				return false;
			}
			if (!confirm("确认修改?")) {
				return false;
			}

			//提交修改信息逻辑
			var managerInfo = {
				manager_id : $("#manager_id").val(),
				account : $("#i_account").val(),
				name : $("#i_name").val(),
				identity : $("#i_identity").val(),
				phone : $("#i_phone").val(),
				rank : $("input[name='type']:checked").val()
			};
			console.log(managerInfo);
			/* $.ajax({
				"data" : "managerInfo=" + JSON.stringify(managerInfo),
				"url" : "./AlterManagerInfoServlet",
				"type" : "POST",
				"success" : function(result) {
					var resultJson = JSON.parse(result);
					if (resultJson.code == "200") {
						alert("修改成功");
						//刷新页面
						$.post("./ManagerListServlet", function(data) {
							$('#content').html(data);
							
						});
					} else {
						alert("修改失败");
					}
				}
			}); */
		});
		//新建管理员信息窗口
		$('#btn_ensure1').on('click', function() {
			//判断输入合法性
			if (!$("#manager_create_form").valid()) {
				return false;
			}
			if (!confirm("确认新建?")) {
				return false;
			}
			//提交修改信息逻辑
			var managerInfo = {
				account : $("#i_account1").val(),
				password : $("#i_password1").val(),
				name : $("#i_name1").val(),
				identity : $("#i_identity1").val(),
				phone : $("#i_phone1").val(),
				rank : $("input[name='i_rank1']:checked").val()
			};
			console.log(managerInfo);
			/* $.ajax({
				"data" : "managerInfo=" + JSON.stringify(managerInfo),
				"url" : "./AlterManagerInfoServlet",
				"type" : "POST",
				"success" : function(result) {
					var resultJson = JSON.parse(result);
					if (resultJson.code == "200") {
						alert("新建成功");
						
						//刷新页面
						$.post("./ManagerListServlet", function(data) {
							$('#content').html(data);
							
						});
					} else {
						alert("新建失败");
					}
				}
			}); */
			alert("新建成功");
			$("#li_manager").trigger("click");
		});
		//修改密码
		$('#btn_ensure2').on('click', function() {
			//判断输入合法性
			if (!$("#manager_alterpwd_form").valid()) {
				return false;
			}
			if (!confirm("确认修改?")) {
				return false;
			}
			//提交修改密码逻辑
			var managerInfo = {
				manager_id : $("#manager_id2").val(),
				password : $("#i_new_password2").val()
			};
			console.log(managerInfo);
			/* $.ajax({
			"data" : "managerInfo=" + JSON.stringify(managerInfo),
			"url" : "./AlterManagerInfoServlet",
			"type" : "POST",
			"success" : function(result) {
				var resultJson = JSON.parse(result);
				if (resultJson.code == "200") {
					alert("修改成功");
					
					//刷新页面
					$.post("./ManagerListServlet", function(data) {
						$('#content').html(data);
						
					});
				} else {
					alert("修改失败");
				}
			}
			}); */
			alert("修改成功");
		});
	});

	//删除按钮
	function remove(widget) {
		//删除数据逻辑
	}

	//修改密码
	function alterPassword(widget) {
		var i = 0;
		$(widget).parent("td").siblings("td").each(function() {
			switch (i) {
			case 0:
				$('#manager_id2').val($(this).attr("class"));
				break;
			case 1:
				$('#i_account2').val($(this).text());
				break;
			case 2:
				break;
			}
			i++;
		});
		$('#bcg_alter_password').show();
	}

	//编辑按钮
	function edit(widget) {
		var i = 0;
		$(widget).parent("td").siblings("td").each(function() {
			switch (i) {
			case 0:
				$('#manager_id').val($(this).attr("value"));
				$('#i_name').val($(this).text());
				break;
			case 1:
				$('#i_account').val($(this).text());
				break;
			case 2:
				$('#i_identity').val($(this).text());
				break;
			case 3:
				$('#i_phone').val($(this).text());
				break;
			case 4:
				$('#i_create_time').val($(this).text());
				break;
			case 5:
				console.log($(this).text());
				if ($.trim($(this).text()) == "超级管理员") {
					$("input:radio[name=type]").eq(0).trigger("click");
				} else if ($.trim($(this).text()) == "考试管理员") {
					$("input:radio[name=type]").eq(1).trigger("click");
				} else if ($.trim($(this).text()) == "教师管理员") {
					$("input:radio[name=type]").eq(2).trigger("click");
				} else {
					console.log("1111");
					$("input:radio[name=type]").eq(2).trigger("click");
				}
				break;
			}
			i++;
		});

		$('#bcg_editor').show();
	}

	//清空按钮
	function setEmpty() {
		$("#i_ensure_password2").val("");
		$("#i_new_password2").val("");
		$("#i_name1").val("");
		$("#i_account1").val("");
		$("#i_identity1").val("");
		$("#i_phone1").val("");
		$("#i_password1").val("");
		$("#hiden_radio").attr("checked", true);
	}
	//创建管理员按钮
	$('#create_btn').on('click', function() {
		$('#create_manager').show();
	});

	$(function() {
		//管理员编辑窗口
		$("#manager_edit_form").validate({
			rules : {
				i_account : {
					required : true,
				},
				i_name : {
					required : true,
					maxlength : 25,
					stringCheck:true,
				},
				i_identity : {
					required : true,
					isIdCardNo : true,
				},
				i_phone : {
					required : true,
					isMobile : true,
				},
				type : {
					required : true
				}
			},
			messages : {
			/* i_account : {
				alnum : "只能包括英文字母和数字！"
			}, */
			},
			onkeyup : false,
			focusCleanup : true,
			success : "valid",

		});
		
		//管理员创建窗口
		$("#manager_create_form").validate({
			rules : {
				i_account1 : {
					required : true,
					isRightfulString : true,
				},
				i_name1 : {
					required : true,
					maxlength : 25,
					stringCheck:true,
				},
				i_identity1 : {
					required : true,
					isIdCardNo : true,
				},
				i_phone1 : {
					required : true,
					isMobile : true,
				},
				i_password1 : {
					required : true,
					minlength : 6,
					maxlength : 20,
					isRightfulString:true,
				},

				i_rank1 : {
					required : true
				}
			},
			onkeyup : false,
			focusCleanup : true,
			success : "valid"
		});
		
		//修改密码窗口
		$("#manager_alterpwd_form").validate({
			rules : {
				i_new_password2 : {
					required : true,
					minlength : 6,
					maxlength : 20,
					isRightfulString:true,
				},
				i_ensure_password2 : {
					required : true,
					minlength : 6,
					maxlength : 20,
					equalTo : "#i_new_password2"
				}
			},
			onkeyup : false,
			focusCleanup : true,
			success : "valid"
		});
	});
	$.validator.addMethod("isMobile", function(value, element) {  
	    var length = value.length;  
	    var regPhone = /^1([3578]\d|4[57])\d{8}$/;  
	    return this.optional(element) || ( length == 11 && regPhone.test(value));    
	}, "请正确填写您的手机号码"); 
	$.validator.addMethod("isIdCardNo", function(value, element) {
		return this.optional(element) || isIdCardNo(value);
		}, "请正确输入您的身份证号码");
	$.validator.addMethod("isRightfulString", function(value, element) {       
	    return this.optional(element) || /^[A-Za-z0-9_-]+$/.test(value);       
	}, "请输入合法字符"); 
	$.validator.addMethod("stringCheck", function(value, element) {       
	    return this.optional(element) || /^[a-zA-Z0-9\u4e00-\u9fa5-_]+$/.test(value);       
	}, "存在非法字符");   

</script>
</ html>